<template>
	<view class="" style="background-color: #f0f0f0;height: 692px;">
		<u-row style="padding-top: 30px;margin-left: 10px;">
			<u--text  type="info" text="基础信息"></u--text>
		</u-row>
		<u-cell-group style="background-color: #fff;margin-top:20px;">
			<u-cell
			    title="头像"
			    isLink
				@click="show = true"
			></u-cell>
			<u-cell
			    title="账号"
			    isLink
			    url="/pages/personal/account"
			></u-cell>
			<u-cell
			    title="昵称"
			    isLink
			    url="/pages/personal/nick-name"
			></u-cell>
			<u-cell
			    title="个人简介"
			    isLink
			    url="/pages/personal/introduction"
			></u-cell>
			<u-cell
			    title="收获地址"
			    isLink
			    url="/pages/personal/address/address"
			></u-cell>
		</u-cell-group>
		<u-row style="padding-top: 30px;margin-left: 10px;">
			<u--text type="info" text="账号绑定"></u--text>
		</u-row>
		<u-cell-group style="background-color: #fff;margin-top:20px;">
			<u-cell
			    title="手机"
			    isLink
			    url="/pages/personal/phone"
			><u-text slot="right-icon" size="10" :text="phone"></u-text>
			</u-cell>
			<u-cell
			    title="淘宝"
			    isLink
			    url="/pages/componentsB/badge/badge"
				value="未绑定"
			></u-cell>
			<u-cell
			    title="支付宝"
			    isLink
			    url="/pages/componentsB/badge/badge"
				value="未绑定"
			></u-cell>
			<u-cell
			    title="微信"
			    isLink
			    url="/pages/componentsB/badge/badge"
				value="未绑定"
			></u-cell>
		</u-cell-group>
		<u-row style="padding-top: 60px;width: 90%;margin: 0 auto;">
			<u-button type="primary" text="退出登录" @click="outLogin"></u-button>
		</u-row>
		<u-popup :show="show"  mode="center" @close="close" @open="open">
			<view style="width: 300px;height: 300px;">
				<u-form-item label="" label-width="60" prop="facadeImageId" style="margin-left: 105px;margin-top:40px">
					<view class="u-demo-block">
						<view class="u-demo-block__content">
							<view class="u-page__upload-item">
							<u-upload
								:fileList="fileList1"
								@afterRead="afterRead"
								@delete="deletePic"
								name="1"
								multiple
								:maxCount="1"
							></u-upload>
							</view>
						</view>
					</view>
				</u-form-item>
				<u-button type="primary" style="width: 90px;margin-top: 60px;" text="确定" @click="uploadFile"></u-button>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 存放图片
				fileList1: [],
				// 弹窗默认关闭
				show: false,
				// 头像id
				avatarId:'',
				// 登录用户id
				id:'',
				// 手机号
				phone:'',
			}	
		},
		mounted(){
			// 头部获取用户id
			this.id = uni.getStorageSync('id')
			// 根据用户id查询用户信息
			this.getAllUserById()
		},
		methods: {
			// 退出登录
			outLogin(){
				const value = uni.removeStorageSync('token')
				// 修改成功跳转
				uni.switchTab({
					url: '/pages/my/my',
				})
				window.location.reload();
			},
			//根据id查询用户信息
			getAllUserById() {
				this.$myRequest({
					url: '/eat-service/userProtal/getAllUserById',
					method: 'get',
					data: {
						id: this.id,
					}
				}).then(res => {
					this.phone = res.data.obj.obj.phone
					console.log(this.nickName)
				})
			},
			// 修改用户头像
			updateAvatarId(){
				this.$myRequest({
					url:'/eat-service/userProtal/updateAvatarId',
					method:'get',
					data:{
						'id' : this.id,
						'avatarId':this.avatarId
					}
				}).then(res => {
					debugger
					if(res.data.flag != null){
						this.account = ''
						uni.showToast({
							title: '修改成功',
							//将值设置为 success 或者直接不用写icon这个参数
							icon: 'success',
							//显示持续时间为 2秒
							duration: 2000
						})
						// 修改成功跳转
						uni.switchTab({
							url: '/pages/my/my'
						})
						window.location.reload();
					} else {
						uni.showToast({
							title: '修改失败',
							//将值设置为 success 或者直接不用写icon这个参数
							icon: 'success',
							//显示持续时间为 2秒
							duration: 2000
						})
					}
				})
			},
			// 测试图片上传 uni.uploadFile
			uploadFile () {
				var list = []
				list.push(this.fileList1)
				for(var i=1;i<=list.length;i++){
					uni.uploadFile({
						url: 'http://127.0.0.1:15000/eat-service/shop/applyUploadImage',
						filePath: this[`fileList${i}`][0].thumb,
						name: 'file',
						header: {
							'token': uni.getStorageSync('token')
						},
						success: (res) => {
							var data = JSON.parse(res.data)
							this.avatarId = data.obj.imageId
							this.updateAvatarId()
						}
					})
				}
			},
			// 上传方法
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: 'http://127.0.0.1:15000/eat-service/shop/testUploadFile', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								resolve(res.data.data)
							}, 1000)
						}
					});
				})
			},
			// 新增图片
			async afterRead(event) {
				
			},
			async afterRead(event) {
				// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
					}))
					fileListLen++
				}
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			open() {
				// console.log('open');
			},
			close() {
				this.show = false
				// console.log('close');
			}
		},
	}
</script>

<style>
</style>